<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>微信安全支付-{:C('c_title')}</title>
        <script src="__JQ__"></script>
        <!--[if lt IE 9]>
        <script src="__JS__/jquery1.11.3.min.js"></script>
        <![endif]-->
        <link href="__MZUI__/css/amazeui.css" rel="stylesheet" type="text/css" />
        <link href="__CSS__/home/demo.css" rel="stylesheet" type="text/css" />
        <link type="text/css" href="__CSS__/home/style.css" rel="stylesheet" />
        <style type="text/css">
            .main{background-color: #ecedf2;padding-bottom: 50px;margin-top: 50px}
            .w{width: 990px;margin: 0 auto;overflow: hidden;}
            .order{overflow: hidden;position: relative;}
            .order .o-left{float: left;width: 635px;padding-top: 10px;padding-bottom: 10px;}
            .order .o-right{float: right;width: 300px;padding-top: 25px;padding-bottom: 10px;padding-right: 25px;overflow: hidden;}
            .payment{overflow: hidden;background-color: #fff;padding: 12px 30px 0;-moz-box-shadow: 0 0 6px rgba(0,0,0,.2);-webkit-box-shadow: 0 0 6px rgba(0,0,0,.2);box-shadow: 0 0 6px rgba(0,0,0,.2);-moz-transition: all .2s ease-in-out;-o-transition: all .2s ease-in-out;-webkit-transition: all .2s ease-in-out;transition: all .2s ease-in-out;}
            .p-w-bd, .pay-weixin{zoom: 1;overflow: hidden;}
            .p-w-hd{margin-bottom: 20px;font-size: 18px;font-family: "Microsoft Yahei";}
            .p-w-bd{padding-left: 130px;margin-bottom: 30px;}
            .font-red{color: #ff5d5b;}
            .p-w-box{float: left;width: 300px;}
            .p-w-sidebar{float: left;width: 379px;height: 421px;padding-left: 50px;margin-top: -20px;background: url(/Public/img/home/phone-bg.png) 50px 0 no-repeat;}
            .pw-box-hd{margin-bottom: 20px;}
            .pw-box-ft{height: 60px;padding: 8px 0 8px 125px;background: url(/Public/img/home/icon-red.png) 50px 8px no-repeat #f43e91;line-height: 23px;color: #fff;}
            .order .o-title{line-height: 26px;height: 26px;overflow: hidden;font-size: 14px;}
            .order .o-tips{line-height: 20px;height: 20px;color: #f43e91;}
            .order .o-price{text-align: right;line-height: 26px;margin-bottom: 4px;font-size: 18px;font-weight: bold;}
            .order .o-price em{vertical-align: bottom;}
            .p-w-hd{margin-bottom: 20px;font-size: 18px;font-family: "Microsoft Yahei";}
            .order .o-price strong{font-size: 18px;vertical-align: bottom;color: #ff5d5b;margin: 0 3px;}
            .payment-change .pc-wrap{display: block;height: 60px;line-height: 56px;padding: 0 20px;-moz-transition: all .1s;-o-transition: all .1s;-webkit-transition: all .1s;transition: all .1s;}
            .payment-change .pc-wrap .pc-w-arrow-left{float: left;margin-right: 15px;}
            .payment-change .pc-wrap strong{color: #2ea7e7;margin-right: 30px;font-size: 16px;float: left;cursor: pointer;}
            .order .o-price em{vertical-align: bottom;}
            em{font-style: normal;}
        </style>
    </head>
    <body>
    <include file="Include/header" />
    <div class="main">
        <div class="w">
            <!-- order 订单信息 -->
            <div class="order">
                <div class="o-left">
                    <h3 class="o-title">请您及时付款，以便订单尽快处理！订单号：<span class="price">{$out_trade_no}</span></h3>
                    <p class="o-tips">
                        <input id="out_trade_no" type="hidden"  value="{$out_trade_no}">
                        {$title}
                        平台认证 请您放心购买。
                    </p>
                </div>
                <div class="o-right">
                    <div class="o-price">
                        <em>应付金额</em><strong>{$payPrice}</strong><em>元</em>
                    </div>
                </div>
                <div class="clr"></div>

                <div class="o-list j_orderList" id="listPayOrderInfo">
                    <!-- 单笔订单 -->
                    <div class="o-list-info">
                        <span class="mr10" id="shdz"></span>
                        <span class="mr10" id="shr"></span>
                        <span id="mobile"></span>
                    </div>
                    <div class="o-list-info">
                        <span id="spmc"></span>
                    </div>
                </div>        
            </div>
            <!-- order 订单信息 end -->

            <!-- payment 支付方式选择 -->
            <div class="payment">
                <!-- 微信支付 -->
                <div class="pay-weixin">
                    <div class="p-w-hd">微信支付</div>
                    <div class="p-w-bd" style="position:relative">
                        <div class="p-w-box">
                            <div class="pw-box-hd" id="qrcode">

                            </div>
                            <div class="pw-box-ft">
                                <p>请使用微信扫一扫</p>
                                <p>扫描二维码支付</p>
                            </div>
                        </div>
                        <div class="p-w-sidebar"></div>
                    </div>
                </div>
                <!-- 微信支付 end -->
                <!-- payment-change 变更支付方式 -->
                <div class="payment-change">
                    <a class="pc-wrap" id="reChooseUrl" href="{:HOME_URL}/pay?key={$key}">
                        <i class="pc-w-arrow-left">&lt;</i>
                        <strong>选择其他支付方式</strong>
                    </a>
                </div>
                <!-- payment-change 变更支付方式 end -->
            </div>
            <!-- payment 支付方式选择 end -->
        </div>
    </div>
        <!--公共底部-->
        <div style="clear: both"></div>
        <include file="Include/footer" />
</body>
</html>
<script src="__JS__/jquery.qrcode.min.js"></script>
<script>
    if (<?php echo $unifiedOrderResult["code_url"] != NULL; ?>)
    {
        var url = "<?php echo $code_url; ?>";
        $("#qrcode").qrcode({
            render: "table", //table方式 
            width: 300, //宽度 
            height: 300, //高度 
            text: url //任意内容 
        });
    }
</script>

<script type="text/javascript">
    //调用微信JS api 支付
    $(document).ready(function () {
        setInterval("ajaxstatus()", 3000);
    });
    function ajaxstatus() {
        //alert($("#out_trade_no").val());
        if ($("#out_trade_no").val() != 0) {
            $.ajax({
                url: "payStatus?tradeno=" + $("#out_trade_no").val(),
                type: "GET",
                dataType: "json",
                data: "",
                success: function (data) {
                    if (data.status == 1) { //订单状态为1表示支付成功
                        window.location.href = '{:HOME_URL}{:U("/Order/index",array('status'=>'payed'))}'; //页面跳转
                    }
                }
            });
        }
    }
</script>